<%@ page import="com.sxp.bean.User" %>
<%@ page import="java.util.List" %>
<%@ page import="com.sxp.bean.Book" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>主页</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.min.css">
    <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>

    <link rel="stylesheet" href="/obs/static/css/index.css">
</head>
<body>

<!-- nav begin -->
<nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
        <a class="navbar-item" href="#">
            网上书城
        </a>

        <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navMenu">
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
        </a>
    </div>

    <div id="navMenu" class="navbar-menu">
        <div class="navbar-start">
            <a class="navbar-item" href="/obs/index">
                主页
            </a>
            <a class="navbar-item" href="/obs/book/recommend">
                推荐
            </a>

            <form action="/obs/book/search" class="navbar-item" method="get">
                <input class="input" type="text" placeholder="书名" name="bookname">
                <button class="button is-rounded is-info" type="submit">搜索</button>
            </form>


        </div>

        <%
            User user = (User) session.getAttribute("user");
            if (user == null) {
        %>
        <div class="navbar-end">
            <div class="navbar-item">
                <div class="buttons">
                    <a class="button is-primary" href="/obs/register.jsp">
                        <strong>注册</strong>
                    </a>
                    <a class="button is-light" href="/obs/login.jsp">
                        登录
                    </a>
                </div>
            </div>
        </div>
        <%
        } else {
        %>
        <div class="navbar-end">
            <div class="navbar-item has-dropdown is-hoverable">
                <a class="navbar-link">
                    <%=user.getUsername()%>
                </a>

                <div class="navbar-dropdown is-right">
                    <%
                        if (!user.getAdmin()) {
                    %>
                    <a class="navbar-item" href="/obs/user/carts">
                        购物车
                    </a>
                    <%
                    } else {
                    %>
                    <a class="navbar-item" href="/obs/admin/books">
                        书籍列表
                    </a>
                    <a class="navbar-item" href="/obs/add_book.jsp">
                        添加书籍
                    </a>
                    <%
                        }
                    %>
                    <a class="navbar-item" href="/obs/password.jsp">
                        修改密码
                    </a>
                    <a class="navbar-item" href="/obs/logout">
                        退出
                    </a>

                </div>
            </div>
        </div>
        <%
            }
        %>


    </div>
</nav>
<!-- nav end -->





<div class="container is-fluid content">

    <%
        List<Book> books = (List<Book>) session.getAttribute("books");
    %>

    <div class="notification is-primary">
        欢迎来到网上书城，在知识的海洋里尽情地遨游吧！
    </div>

    <%
        if (books.size() == 0) {
            %>
                <div class="columns message">
                    <div class="column"></div>
                    <div class="column is-one-third">
                        <div class="notification is-success">
                            <strong>
                                本站的书都长腿跑了吗？！@管理员
                            </strong>
                        </div>
                    </div>
                    <div class="column"></div>
                </div>
            <%
        } else {
            %>
                <%
                    int temp;
                    int count = books.size();
                    int remain = 0;
                    for (int i = 0; i < count; i++) {
                        %>
                            <div class="columns">
<%--                                <div class="column"></div>--%>
                        <%
                        temp = i + 5;
                        if (temp > count) {
                            remain = temp - count;
                            temp = count;

                        }
                        for (; i < temp; i++) {
                            %>
                                <div class="column">
                                    <div class="book-card">
                                        <div class="book-image">
                                            <img src="<%=books.get(i).getImage()%>">
                                        </div>
                                        <a class="book-name" href="http://localhost:8080/obs/book/detail?id=<%=books.get(i).getId()%>"><%=books.get(i).getName()%></a>
                                    </div>
                                </div>
                            <%
                        }
                        if (remain != 0) {
                            for (int k = 0; k < remain; k++) {
                                %><div class="column"></div><%
                            }
                        }
                        --i;
                        %>
<%--                                <div class="column"></div>--%>
                            </div>
                        <%
                    }
                %>
            <%
        }
    %>


</div>

<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="/obs/static/js/bulma-toggle.js"></script>

</body>
</html>